<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>后台揽件路径规划</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/aaa.css">
<script src="${pageContext.request.contextPath}/js/jquery-3.1.0.min.js"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
<style type="text/css"></style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=BK1nKL02Lul9X8RURxIvqGhORqsGigsB"></script>
</head>

<body>
<img calss="img-responsive" width="100%" src="${pageContext.request.contextPath}/image/head.jpg" />
<div class="container-fluid">
  <div class="row">
    <div class="span12">
      <nav class="navbar navbar-inverse" role="navigation">
        <div class="container-fluid"> 
          <!-- Brand and toggle get grouped for better mobile display -->
          <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
            <a class="navbar-brand" href="#">后台管理</a> </div>
          
          <!-- Collect the nav links, forms, and other content for toggling -->
          <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
              <li><a href="${ pageContext.request.contextPath }/adminExpress_findByPageAll.action?page=1">订单管理</a></li>
              <li class="active" ><a href="#">今日揽件路径规划</a></li>
              <li><a href="${ pageContext.request.contextPath }/adminExpress_findAllToAddr.action">今日派送路径规划</a></li>
              <li><a href="${ pageContext.request.contextPath }/adminPort_findAll.action">车场管理</a></li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
              <li><a href="${ pageContext.request.contextPath }/adminLogin_loginOut.action">注销</a></li>
              <li>
                <h4><span class="label label-success"><%=new Date().toLocaleString() %></span></h4>
              </li>
            </ul>
          </div>
          <!-- /.navbar-collapse --> 
        </div>
        <!-- /.container-fluid --> 
      </nav>
</div>
  </div>
  <div id="allmap" class="col-lg-12" style="height:600px"> </div>
  <div align="center">
  		<h4><font color="red"><span id="long">总路径长度为：</span></font></h4>
  		<h4><font color="red"><span id="count">总车辆数为：</span></font></h4>
        <h4><font color="red"><span id="load">最大负重差为：</span></font></h4>
  </div>
  <br>
  <div align="center">当前为第<span id="nplan"></span>方案&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;共<span id="tplans"></span>个方案</div>
  <div align="center">
    <button type="button" class="btn btn-info" onclick="forword()" id="forword">上一个方案 </button>
    <button type="button" class="btn btn-success">确认方案 </button>
    <button type="button" class="btn btn-info" onclick="next()" id="next">下一个方案 </button>
  </div>
</div>
</body>
</html>
<script type="text/javascript">
	// 百度地图API功能
	var no=0;
	function forword(){
		no=no-1;
		init();
	}
	function next(){
		no=no+1;
		init();
	}
	var plans=${requestScope["javaJson"]};
	$('#tplans').html(plans.length);
	function init(){
		$('#nplan').html(no+1);
		var map = new BMap.Map("allmap");    // 创建Map实例
		map.centerAndZoom("广州", 11);  // 初始化地图,设置中心点坐标和地图级别
		map.addControl(new BMap.MapTypeControl());   //添加地图类型控件
		map.setCurrentCity("广州");          // 设置地图显示的城市 此项是必须设置的
		map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
		var plan=plans[no];
		var long=plan.length/1000;
		var maxload=0.0;
		var minload=999.0;
		for(var i=0;i<plan.route.length;i++){
			if(maxload<plan.route[i].weight){
				maxload=plan.route[i].weight;
			}
			if(minload>plan.route[i].weight){
				minload=plan.route[i].weight;
			}
		}
		$('#long').html("总路径长度为："+long+"公里");
		$('#count').html("总车辆数为："+plan.route.length+"辆");
		$('#load').html("最大负载差为："+(maxload-minload)+"公斤");
		if(no==0){
			$('#next').attr("disabled",false);
		}else{
			$('#next').attr("disabled",true);
		}
		if(no==(plans.length-1)){
			$('#forword').attr("disabled",false);
		}else{
			$('#forword').attr("disabled",true);
		}
		for(var i=0;i<plan.route[i].length;i++){
			var deport=new BMap.Point(plan.route[i].deport.LNG,plan.route[i].deport.LAT);
			var points=new Array();
			for(var j=0;j<plan.route[i].goodsList.length;j++){
				points.push(new BMap.Point(plan.route[i].goodsList[j].LNG,plan.route[i].goodsList[j].LAT));
			}
			var driving = new BMap.DrivingRoute(map, {renderOptions:{map: map, autoViewport: true}});
			driving.search(deport, deport,{waypoints:points});//waypoints表示途经点
		}
	}
	window.onload=init();
</script>